<template>
    <a-spin :spinning="confirmLoading">
        <j-form-container :disabled="formDisabled">
            <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
                <a-row>
                    <!-- <a-col :span="24">
                        <a-form-model-item label="预订单号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="bookCode">
                            <a-input v-model="model.bookCode" placeholder="请输入预订单号" disabled></a-input>
                        </a-form-model-item>
                    </a-col> -->
                    <a-col :span="12">
                        <a-form-model-item label="房间类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="roomTypeCode">
                            <j-dict-select-tag type="list" v-model="model.roomTypeCode" @change="roomTypeChange"
                                dictCode="room_type,room_type_name,room_type_code" placeholder="请选择房间类型" />
                        </a-form-model-item>
                    </a-col>
                    <a-col :span="12">
                        <a-form-model-item label="入住模式" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="checkInMode">
                            <a-select v-model="model.checkInMode" @change="checkInModeChange">
                                <a-select-option v-for="item in checkInModeOptions" :key="item.code" :value="item.code">
                                    {{ item.name }}
                                </a-select-option>
                            </a-select>
                            <!-- <j-dict-select-tag type="list" v-model="model.checkInMode" dictCode="book_type"
                                placeholder="请选择入住模式" /> -->
                        </a-form-model-item>
                    </a-col>
                </a-row>
                <a-row>
                    <a-col :span="12">
                        <a-form-model-item label="早餐份数" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="breakfastNum">
                            <a-input-number v-model="model.breakfastNum" placeholder="请输入额定房价" style="width: 100%" />
                        </a-form-model-item>
                    </a-col>
                    <a-col :span="12">
                        <a-form-model-item label="额定房价" :labelCol="labelCol" :wrapperCol="wrapperCol"
                            prop="ratedHousePrice">
                            <a-input-number v-model="model.ratedHousePrice" placeholder="请输入额定房价" style="width: 100%"
                                disabled />
                        </a-form-model-item>
                    </a-col>
                </a-row>
                <a-row>
                    <a-col :span="12">
                        <a-form-model-item label="预抵店时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="dateArrival">
                            <j-date v-model="model.dateArrival" :showTime="true" dateFormat="YYYY-MM-DD HH:mm:ss"
                                style="width: 100%;" />
                        </a-form-model-item>
                    </a-col>
                    <a-col :span="12">
                        <a-form-model-item label="预离店时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="dateDeparture">
                            <j-date v-model="model.dateDeparture" :showTime="true" dateFormat="YYYY-MM-DD HH:mm:ss"
                                style="width: 100%;" />
                        </a-form-model-item>
                    </a-col>
                </a-row>
                <a-row>
                    <a-col :span="12">
                        <a-form-model-item label="房晚数" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="dateNum">
                            <a-input-number v-model="model.dateNum" placeholder="请输入额定房价" style="width: 100%" disabled />
                        </a-form-model-item>
                    </a-col>
                    <a-col :span="12">
                        <a-form-model-item label="预定房间数" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="bookRoomNum">
                            <a-input-number v-model="model.bookRoomNum" placeholder="请输入额定房价" style="width: 100%"
                                disabled />
                        </a-form-model-item>
                    </a-col>
                </a-row>
                <a-row>

                    <a-col :span="12">
                        <a-form-model-item label="是否加床" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="isExtraBed">
                            <j-dict-select-tag type="list" v-model="model.isExtraBed" dictCode="book_type"
                                placeholder="请选择入住模式" />
                        </a-form-model-item>
                    </a-col>
                    <a-col :span="12">
                        <a-form-model-item label="加床费" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="extraBedAmount">
                            <a-input-number v-model="model.extraBedAmount" placeholder="请输入额定房价" style="width: 100%"
                                disabled />
                        </a-form-model-item>
                    </a-col>
                </a-row>
                <a-row>
                    <a-col :span="12">
                        <a-form-model-item label="折扣" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="discount">
                            <a-input-number v-model="model.discount" placeholder="请输入额定房价" style="width: 100%" :step="0.01"
                                :min="0.01" :max="1" />
                        </a-form-model-item>
                    </a-col>
                    <a-col :span="12">
                        <a-form-model-item label="房价" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="roomPrice">
                            <a-input-number v-model="model.roomPrice" placeholder="请输入额定房价" style="width: 100%" disabled />
                        </a-form-model-item>
                    </a-col>
                </a-row>
                <a-row>
                    <a-col :span="12">
                        <a-form-model-item label="房间号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="roomCode">
                            <a-input v-model="model.roomCode" placeholder="请输入联系电话"></a-input>
                        </a-form-model-item>
                    </a-col>
                </a-row>
            </a-form-model>
        </j-form-container>
    </a-spin>
</template>

<script>

import { httpAction, getAction } from '@/api/manage'
import { validateDuplicateValue } from '@/utils/util'

export default {
    name: 'YuDingMingXiForm',
    components: {
    },
    props: {
        //表单禁用
        disabled: {
            type: Boolean,
            default: false,
            required: false
        },
        yudingdan: {
            type: Object,
            required: true,
        }
    },
    data() {
        return {
            model: {
                bookCode: this.yudingdan.bookCode,
                discount: 1
            },
            labelCol: {
                xs: { span: 24 },
                sm: { span: 7 },
            },
            wrapperCol: {
                xs: { span: 24 },
                sm: { span: 16 },
            },
            confirmLoading: false,
            validatorRules: {
                roomTypeCode: [{ required: true, message: '请完善内容' }],
                breakfastNum: [{ required: true, message: '请完善内容' }],
                ratedHousePrice: [{ required: true, message: '请完善内容' }],
                dateArrival: [{ required: true, message: '请完善内容' }],
                dateDeparture: [{ required: true, message: '请完善内容' }],
                dateNum: [{ required: true, message: '请完善内容' }],
                bookRoomNum: [{ required: true, message: '请完善内容' }],
                isExtraBed: [{ required: true, message: '请完善内容' }],
                discount: [{ required: true, message: '请完善内容' }],
                roomPrice: [{ required: true, message: '请完善内容' }],
            },
            url: {
                add: "/room/roomBookInfoMx/add",
                edit: "/room/roomBookInfoMx/edit",
                queryById: "/room/roomBookInfoMx/queryById"
            },
            checkInModeOptions: [],
            roomTypeDetail: {},
        }
    },
    computed: {
        formDisabled() {
            return this.disabled
        },
    },
    async created() {
        //备份model原始值
        this.modelDefault = JSON.parse(JSON.stringify(this.model));
    },
    methods: {
        async roomTypeChange(value) {
            if (value) {
                const res = await getAction('/room/roomType/queryByCode', { roomTypeCode: value })
                if (res.success) {
                    this.checkInModeOptions = res.result.roomFlagList
                    this.roomTypeDetail = res.result.roomType

                } else {
                    this.$message.warning('获取房间类型或入住模式失败: ' + res.message)
                }
            } else {
                this.checkInModeOptions = []
                this.roomTypeDetail = {}
            }
            this.model.breakfastNum = this.roomTypeDetail.breakfastNum
            this.model.ratedHousePrice = this.roomTypeDetail.roomPrice
            this.model.roomPrice = this.roomTypeDetail.roomPrice * this.model.discount
        },
        checkInModeChange(value) {
            if (value) {
                const checkInDetail = this.checkInModeOptions.find(item => item.code === value)
                this.model.ratedHousePrice = checkInDetail.price
                this.model.roomPrice = checkInDetail.price * this.model.discount
            } else {
                this.model.ratedHousePrice = this.roomTypeDetail.roomPrice
                this.model.roomPrice = this.roomTypeDetail.roomPrice * this.model.discount
            }
        },
        add() {
            this.edit(this.modelDefault);
        },
        async edit(record) {
            this.model = Object.assign({}, record);
            if (this.model.roomTypeCode) {
                const res = await getAction('/room/roomType/queryByCode', { roomTypeCode: this.model.roomTypeCode })
                if (res.success) {
                    this.checkInModeOptions = res.result.roomFlagList
                } else {
                    this.$message.warning('获取房间类型或入住模式失败: ' + res.message)
                }
            }
            this.visible = true;
        },
        submitForm() {
            const that = this;
            // 触发表单验证
            this.$refs.form.validate(valid => {
                if (valid) {
                    that.confirmLoading = true;
                    let httpurl = '';
                    let method = '';
                    if (!this.model.id) {
                        httpurl += this.url.add;
                        method = 'post';
                    } else {
                        httpurl += this.url.edit;
                        method = 'put';
                    }
                    httpAction(httpurl, this.model, method).then((res) => {
                        if (res.success) {
                            that.$message.success(res.message);
                            that.$emit('ok');
                        } else {
                            that.$message.warning(res.message);
                        }
                    }).finally(() => {
                        that.confirmLoading = false;
                    })
                }

            })
        },
    }
}
</script>